
<nav class="navbar navbar-dark bg-primary" style="background-color: #3F87FF; padding: 8px;">
  <div class=""><a class="navbar-brand" href="/">
    </a>
    <ul class="nav navbar-nav" style="float:right;">
      <li class="nav-item"><a routerLink="/trip" routerLinkActive="active">Trip</a></li>
      <li class="nav-item"><a routerLink="/hosts" routerLinkActive="active">Host</a></li>
      <li class="nav-item"><a (click)="onToggle()">Message</a></li>
      <li class="nav-item" href=""> <a routerLink="/login">Login</a> </li>
      <li class="nav-item" href=""> <a routerLink="/register">Sign Up</a> </li>
    </ul>
  </div>
</nav>
<router-outlet></router-outlet>
